<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>rAF</title>
</head>
<body>
<button onclick="clickEvent()">点击事件</button>
<progress id="pro" value="10" max="100"></progress>
<script>
    let curValue =10
    function callback(idleDeadline){
        console.log('idle',idleDeadline);
    }
    function clickEvent(idleDeadline){
        console.log('打印',curValue,idleDeadline);
        const oPresss = document.querySelector('#pro')
        oPresss.setAttribute('value',curValue++)
        console.log(idleDeadline);
        if(curValue<100){
             requestIdleCallback(clickEvent,{timeout:1000})
        }
    }

</script>
</body>
</html>